<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="description" content="" />
		<meta name="keywords" content="" />
		
		<script src="../js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		function f1(){
		    //许多选择器都可以作为“并且”选择器使用
		    //$(s1s2s3s4s5)----->并且选择器(保证不会产生歧义)
		    //$(s1,s2,s3,s4,s5)----->联合选择器
		    // $("li.hero").css('color','blue');
		    // $(".hero").css('color','blue'); 
		    //$(':header.hero').css('background-color','green');//没有歧义
		    //$('.hero:header').css('color','red');//没有歧义
			// $('li,.hero').css('color','green');
			// $('#zhang').css('background','green');
		 }
		 </script>
	</head>
	<body>
		<h1>并且选择器</h1>
		<h2 class="hero">并且选择器</h2>
		<h3 class="hero">并且选择器</h3>
		<h4>并且选择器</h4>
		<ul>
		    <li>刘备</li>
		    <li id="zhang">张飞</li>
		    <li class="hero">关羽</li>
		    <li id="zhao">赵云</li>
	
		    <li class="hero">孙权</li>
		    <li>周瑜</li>
		    <li class="hero">黄盖</li>
		    <li>吕蒙</li>
		</ul>
	
		<input type="button" value="触发" onclick="f1()" />
	</body>
</html>
